{{ .dataGrid }}

<!-- 查看详细信息 -->
<div id="member_list_detail_dialog" class="easyui-dialog word-wrap" title="用户信息"
     data-options="modal:true,closed:true"
     style="width:700px;height:450px;padding:5px"></div>

<script type="text/javascript">

    var member_list_datagrid_toolbar = [
        {text: '添加会员', iconCls: 'icons-arrow-add', handler: memberListAdd},
        {text: '刷新', iconCls: 'icons-arrow-arrow_refresh', handler: memberListRefresh}
    ];

    const member_list = $('#member_list_datagrid');

    //搜索
    function systemLogSearch(that) {
        let queryParams = datagrid('options').queryParams;
        $.each($(that).parent('form').serializeArray(), function () {
            queryParams[this['name']] = this['value'];
        });
        member_list.datagrid('reload');
    }

    function submitForm(id) {
        let url = '/b/user/edit?id=' + id
        if (id === 0) {
            url = "/b/user/add"
        }
        $.post(url, $("#ff").serialize(), function (res) {
            if (res.errcode) {
                $.messager.alert('提示信息', res.errmsg, 'error');
            } else {
                $.messager.alert('提示信息', res.errmsg, 'info');
                member_list.datagrid('reload');
                if (id == 0) {
                    $('#member_list_detail_dialog').dialog('close');
                }
            }
        });
        return false
    }


    //参数格式化
    function optFormatter(val) {
        return '<a href="javascript:;" class="btn btn-default btn-xs" onclick="editMemberInfo(' + val + ');">编辑</a>';
    }

    function enabledFormatter(val) {
        return val == 1 ? '<span class="label label-success">启用</span>' : '<span class="label label-default">关闭</span>';
    }

    function memberListAdd() {
        var id = 'member_list_detail_dialog';
        $('#' + id).dialog({
            buttons: [{
                text: '添加',
                handler: function () {
                    submitForm(0)
                }
            }, {
                text: '关闭',
                handler: function () {
                    $('#' + id).dialog('close');
                }
            }],
            content: `<form id="ff" method="post">
	    	<table cellpadding="5" class="dialogtable">
	    	    <tr>
	    			<td style="width: 100px;" align="right">账号:</td>
	    			<td><input class="easyui-textbox" type="text" name="account" value=""></input></td>
	    		</tr>

	    		<tr>
	    			<td style="width: 100px;" align="right">昵称:</td>
	    			<td><input class="easyui-textbox" type="text" name="nickname" value=""></input></td>
	    		</tr>

	    		<tr>
	    			<td align="right">头像:</td>
	    			<td><img src="/assets/backend/static/images/man.jpg" width="60px" height="60px"/> </td>
	    		</tr>

	    		<tr>
	    			<td align="right">邮箱:</td>
	    			<td><input class="easyui-textbox" type="text" name="email" value=""  data-options="required:true,validType:'email'"></input></td>
	    		</tr>
	    		<tr>
	    			<td align="right">密码:</td>
	    			<td><input class="easyui-textbox" type="text" name="password"></input></td>
	    		</tr>

	    		<tr>
	    			<td align="right">积分:</td>
	    			<td><input class="easyui-textbox" type="text" name="integral" value="0"  data-options="required:true"></input></td>
	    		</tr>

	    		<tr>
	    			<td align="right">手机:</td>
	    			<td><input class="easyui-textbox" type="text" name="telphone" value=""></input></td>
	    		</tr>

                <tr>
	    			<td align="right">QQ:</td>
	    			<td><input class="easyui-textbox" type="text" name="qq" value=""></input></td>
	    		</tr>

	    		<tr>
	    			<td align="right">是否启用:</td>
	    			<td>
	    				<select class="easyui-combobox" name="enabled">
	    				<option value="1" selected>启用</option>
	    				<option value="0">关闭</option>
	    				</select>
	    			</td>
	    		</tr>
	    	</table>
	    </form>`
        });
        $('#' + id).dialog('open');
    }

    //查看详细信息
    function editMemberInfo(artid) {
        ajaxLoading()
        $.get("/b/user/info", {id: artid}, function (data) {
            ajaxLoadEnd()
            if (data.errcode) {
                $.messager.error(data.errmsg)
                return
            }
            var data = data.errmsg
            var id = 'member_list_detail_dialog';
            $('#' + id).dialog({
                buttons: [{
                    text: '更新',
                    handler: function () {
                        submitForm(artid)
                    }
                }, {
                    text: '关闭',
                    handler: function () {
                        $('#' + id).dialog('close');
                    }
                }],
                content: `<form id="ff" method="post">
	    	<table cellpadding="5" class="dialogtable">
	    	    <input type="hidden" name="id" value="` + artid + `">

	    	    <tr>
	    			<td style="width: 100px;" align="right">账号:</td>
	    			<td><input class="easyui-textbox" type="text" name="account" value="${data.account}"></input></td>
	    		</tr>

	    		<tr>
	    			<td style="width: 100px;" align="right">昵称:</td>
	    			<td><input class="easyui-textbox" type="text" name="nickname" value="${data.nickname}"></input></td>
	    		</tr>

	    		<tr>
	    			<td align="right">头像:</td>
	    			<td><img src="${data.avatar}" onerror="this.src='/assets/backend/static/images/man.jpg'" width="120px" height="120px"/> </td>
	    		</tr>

	    		<tr>
	    			<td align="right">邮箱:</td>
	    			<td><input class="easyui-textbox" type="text" name="email" value="${data.email}"  data-options="required:true,validType:'email'"></input></td>
	    		</tr>
	    		<tr>
	    			<td align="right">密码:</td>
	    			<td><input class="easyui-textbox" placeholder="不填则不修改" type="text" name="password"></input></td>
	    		</tr>

	    		<tr>
	    			<td align="right">积分:</td>
	    			<td><input class="easyui-textbox" type="text" name="integral" value="${data.integral}"  data-options="required:true"></input></td>
	    		</tr>

	    		<tr>
	    			<td align="right">手机:</td>
	    			<td><input class="easyui-textbox" type="text" name="telphone" value="${data.telphone}"></input></td>
	    		</tr>

                <tr>
	    			<td align="right">QQ:</td>
	    			<td><input class="easyui-textbox" type="text" name="qq" value="${data.qq}"></input></td>
	    		</tr>

	    		<tr>
	    			<td align="right">注册时间:</td>
	    			<td><input class="easyui-textbox" type="text" value="${data.created_at}" readonly></input></td>
	    		</tr>

	    		<tr>
	    			<td align="right">是否启用:</td>
	    			<td>
	    				<select class="easyui-combobox" name="enabled">
	    				<option value="1" ` + (data.enabled == 1 ? 'selected' : '') + `>启用</option>
	    				<option value="0" ` + (data.enabled == 0 ? 'selected' : '') + `>关闭</option>
	    				</select>
	    			</td>
	    		</tr>
	    	</table>
	    </form>`
            });
            $('#' + id).dialog('open');
        })
    }

    function memberListRefresh() {
        member_list.datagrid('reload');
    }
</script>
